<template>
    <div class = "helpBox">
        <van-nav-bar
            title="朋友圈"
            left-arrow
            @click-left="onClickLeft"
    />
        <nav>
            热点问题
        </nav>
        <!--  使用app遇到的问题   -->
        <aside>
            <article>
                <p>朋友圈发布异常问题</p>
                <div class = "icon">
                    <img src="@/assets/images/right.png" alt="">
                </div>
            </article>
            <article>
                <p>朋友圈发布异常问题</p>
                <div class = "icon">
                    <img src="@/assets/images/right.png" alt="">
                </div>
            </article>
            <article>
                <p>朋友圈</p>
                <div class = "icon">
                    <img src="@/assets/images/right.png" alt="">
                </div>
            </article>
        </aside>
    </div>
</template>

<script>
export default {
    methods:{
        Jump_to(){
            this.$router.push("/allHelp")
        },
        onClickLeft(){
            this.$router.go(-1)
        }
    }
}
</script>

<style lang="scss" scoped>
@font-face {
    font-family: font_name;
    src: url("../../assets/font/PingFang-SC-Medium.ttf");
}
    .van-hairline--bottom{
        background:#3D98FF;
        .van-icon-arrow-left{
            font-size:16px;
            font-weight:600;
            color:#fff;
        }
        .van-ellipsis{
            color:#fff;
        }
    }
    .helpBox{
        width:100%;
        background:#F8F8F9;
        // 头部
        nav{
            height:50px;
            width:100%;
            font-size:14px;
            line-height:50px;
            padding-left:10px;
            color:#747474;
            font-family:font_name;
            font-weight:500;
        }
        // 问题
        aside{
            width:100%;
            height:auto;
            article{
                height:50px;
                padding:0  10px;;
                background:#fff;
                display: flex;
                align-items: center;
                justify-content: space-between;
                border-bottom:1px solid #eee;
                font-size:16px;
                // color:#323232;/
                p{
                    color:#323232;
                    font-family:font_name;
                    font-weight:500;
                }
                .icon{
                    height:12px;
                    width:7px;
                    margin-top:-5px;
                    img{
                        height:100%;
                        width:100%;
                    }
                }
            }
        }
    }
</style>

